<template>
	<view class="content">
		<view v-for="(item,index) in orderList" :key="index">
			<view class="distribution_order">
				<view class="distribution_order_1">
					<view class="orderNum">订单号：{{item.orderNo}}</view>
					<view class="isFukuan">{{item.status==0?"待审核":item.status==1?"已通过":item.status==2?"已驳回":item.status+""}}</view>
				</view>
				<view class="distribution_order_2">
					<view style="display: flex;flex-direction: row;align-items: center;">
						<!-- <image :src="item.avatarUrl" mode="" class="avator"></image> -->
						<view class="orderNum" style="margin-left: 10rpx;">{{item.UserNickName}}</view>
					</view>
					<!-- <view class="orderNum">一级</view> -->
					<view class="">
						<text class="orderNum">佣金:</text>
						<text class="orderNum">{{item.money}}</text>
						<text class="orderNum">元</text>
					</view>
				</view>
				<view class="distribution_order_3">
					<view style="display: flex;flex-direction: row;align-items: center;">
						<!-- <image :src="item.logo" mode="" class="good_img"></image> -->
						<view class="">
							<view class="orderNum" style="margin: 20rpx;">{{item.createdAt}}</view>
							<!-- <view class="orderNum" style="margin: 20rpx;">{{item.goods_name}}</view> -->
						</view>
					</view>
					<view class="rmb">￥{{item.orderMoney}}</view>
				</view>
			</view>
		</view>

		<view v-if="orderList.length == 0">
			<u-empty mode="order" text="暂无订单">
			</u-empty>
		</view>

	</view>
</template>

<script>
	import {
		fxteammoneylist,
	} from '@/api/user.js'
	import {
		useStore
	} from '@/store/index.js'
	import {
		onLoad,
		onUnload
	} from "@dcloudio/uni-app"
	import {
		reactive,
		toRefs,
		ref,
		watch,
		computed,
		onMounted,
	} from "vue"
	export default {

		setup() {
			const store = useStore()
			const state = reactive({
				userInfo: computed(() => store.userInfo),
				orderList:[],
				count:"0",
			})
			onLoad((option) => {
				getData()
			})
			const getData = async () => {				
				const {
					data
				} = await fxteammoneylist({
					pageSize: 500,
					page: 1,
				})
				state.orderList = data.records;
				state.count = data.total;
				if(data.records.length>0){
					const {
					data
				} = await fxteammoneylist({
					pageSize: 500,
					page: 2,
				})
				state.orderList =state.orderList.concat( data.records);
				}
			}
			
		
			return {
				...toRefs(state),
				getData,
			}
		}

	}
</script>

<style>
	.content {
		height: 100%;
		overflow-y: auto;
	}

	.rmb {
		font-size: 32rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #E14751;
		margin-right: 20rpx;
	}

	page {
		/* background-color: #f2f2f2; */
	}

	.u-empty {
		background-color: #f2f2f2;
	}


	.distribution_order {
		background-color: #fff;
		margin-bottom: 10rpx;
	}

	.orderNum {
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
	}

	.isFukuan {
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #E14751;
	}

	.distribution_order_1 {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		width: 710rpx;
		height: 80rpx;
		margin: 0 20rpx 0 20rpx;
		border-bottom: 2rpx solid #F2F2F2;
	}

	.distribution_order_2 {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		width: 710rpx;
		height: 75rpx;
		margin: 0 20rpx 0 20rpx;
		border-bottom: 2rpx solid #F2F2F2;
	}

	.avator {
		width: 75rpx;
		height: 75rpx;
	}

	.distribution_order_3 {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 75rpx;
		/* border-bottom: 2rpx solid grey; */
	}

	.good_img {
		width: 140rpx;
		height: 100rpx;
		margin: 0 20rpx 0 20rpx;
	}

	.my_teams {
		/* width: 750rpx; */
		height: 180rpx;
		background-color: #ffffff;
		margin: 20rpx 0 20rpx 0;
		border-radius: 20rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.clear{
		padding: 0 16rpx;
		color: red;
	}
</style>